按著shift，一次選取上一次選到的chekbox至這次選取的checkbox

const checkboxs = document.querySelectorAll('.inbox input[type="checkbox"]');
//取得所有的input，type=“checkbox”，為一個NodeList

function handleCheck(e) {
    console.log(e);
}

checkboxs.forEach(checkbox => checkbox.addEventListener("click", handleCheck));
//監聽每個input是否被click

在我們點擊checkbox時，要判別

1. shift是否被按下（需要批次點擊）
2. 這個按鈕是否有checked（取消點擊不會觸發批次點擊）

let lastChecked;
//宣告一變數，紀錄上一次點擊的input

function handleCheck(e) {
    let inBetween = false; //設定是否在兩次點擊之間的"狀態"
    if (e.shiftKey && this.checked) {
        
    }
    lastChecked = this; //紀錄這次被點擊的input，供下一次使用
}

我們對checkboxs使用.forEach()方法
讓每個input去偵測是否到了點擊的那個input(this)
或是上一次點擊的input(lastChecked)

就會轉變inBetween變成true
之後使用

if (inBetween) {
    checkbox.checked = true;
}

讓之後的input都變成checked
再次遇到this、lastChecked時
再次改動inBetween變成false
之後的input都不會被checked

如下

if (e.shiftKey && this.checked) {
    let inBetween = false;
       checkboxs.forEach(checkbox => {
            if (checkbox === this || checkbox === lastChecked) {
                inBetween = !inBetween;
            }
            if (inBetween) {
                checkbox.checked = true;
            }
        }); 
    }
    lastChecked = this;
}

demo
完整程式碼